import React from 'react'
import styles from './css/Myitem.module.css'
import { Collapse } from 'antd-mobile'
import { useNavigate, useSearchParams } from 'react-router-dom'
const Myitem = (props) => {
    const nav=useNavigate()
    // const lo=useLoaderData()
    const [sp]=useSearchParams()
    return (

        <div>
            <div className={styles.a} onClick={()=>nav(`/cplist:id?id=${props.id}&start=${props.startStation}&end=${props.endStation}&date=${sp.get('date')}`)}>

                <span style={{ color: '#101a38' }}>{props.startTime}</span>
                <span className={styles.b}>{props.trainNo}</span>
                <span style={{ color: '#101a38' }}>{props.endTime}</span>
                <span></span>


                <span style={{ color: '#101a38' }}>{props.startStation}</span>
                <span>{props.startTime}</span>
                <span style={{ color: '#101a38' }}>{props.endStation}</span>
                <span style={{ color: '#101a38' }}>￥{props.ssoftSeat.price}起</span>


                <span>二等座{props.businessSeat.ticketNum}</span>
                <span>一等座{props.fsoftSeat.ticketNum}</span>
                <span>特等座{props.ssoftSeat.ticketNum}</span>
            </div>
            <div>
                <Collapse accordion>
                    <Collapse.Panel key='1' title='展开'>
                        <span style={{ color: '#101a38' }}>{props.startTime}</span>
                        <span className={styles.b}>{props.trainNo}</span>
                        <span style={{ color: '#101a38' }}>{props.endTime}</span>
                        <span></span>


                        <span style={{ color: '#101a38' }}>{props.startStation}</span>
                        <span>{props.startTime}</span>
                        <span style={{ color: '#101a38' }}>{props.endStation}</span>
                        <span style={{ color: '#101a38' }}>￥{props.ssoftSeat.price}起</span>


                        <span>二等座{props.businessSeat.ticketNum}</span>
                        <span>一等座{props.fsoftSeat.ticketNum}</span>
                        <span>特等座{props.ssoftSeat.ticketNum}</span>
                    </Collapse.Panel>
                </Collapse>
            </div>
        </div>
    )
}

export default Myitem
